<template>
  <a-anchor class="anchor">
    <a-anchor-link :href="`meta`" title="介绍" />
    <a-anchor-link v-for="item of props.mdAnchorList" :key="item" :href="`${item}`" :title="item" />
    <a-anchor-link
      v-for="(demo, index) of props.demos"
      :key="demo.name"
      :href="`demo-${demo.name}`"
      :title="demo.title || `demo${Number(index) + 1}`"
    />
    <a-anchor-link href="api" title="API" />
  </a-anchor>
</template>
<script lang="ts" setup>
  import { PropType } from 'vue';
  import { BaseObject } from '@/types/global';

  const props = defineProps({
    mdAnchorList: {
      type: Array,
      default: (): any[] => [],
    },
    demos: {
      type: Array as PropType<BaseObject>,
      default: () => [],
    },
  });
</script>
<style lang="less" scoped>
  .anchor {
    position: fixed;
    right: 0;
    top: 64px;
    width: 200px;
  }
</style>
